<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
// await关键字：
// 1. await必须在async函数内使用，写在普通函数内会报错
        // async function fn(){
        //     let num = await 100
        //     console.log(num)
        // }
        // fn()

// 2. await后面一般会跟着一个promise对象, 返回该对象的结果(成功或失败)
//    如果不是 Promise 对象，就直接返回对应的值。

    const sleep = s => new Promise(resolve => setTimeout(() => resolve(s), s * 1000))
    // const p = sleep(1)
    // console.log(p)
    // p.then(res => {
    //     console.log(res)
    // })

    async function fn(){
        let res = await sleep(3)
        // 下面的代码，相当于.then(res => {})
        console.log(res)
    }
    fn()


    const api_books = 'http://ajax-api.itheima.net/api/books'
    const api_news = 'http://ajax-api.itheima.net/api/news'


    // // 获取新闻列表
    // fetch(api_news).then(res => res.json()).then(res => {
    //     console.log(res)
    // })
    // // 获取图书列表
    // fetch(api_books).then(res => res.json()).then(res => {
    //     console.log(res)
    // })

    //Q：先获取新闻，等新闻的结果回来了之后，我再请求图书列表 ？

    // 获取新闻列表
    fetch(api_news).then(res => res.json()).then(res => {
        console.log(res)
        // 获取图书列表
        fetch(api_books).then(res => res.json()).then(res => {
            console.log(res)
        })
    })

    ;(async function(){
        // await的意思就是等待 
       let res1 = await fetch(api_news).then(res => res.json())
       // await 会阻塞后面代码的执行 
       console.log(res1)
       let res2 = await fetch(api_books).then(res => res.json())
       console.log(res2)
    })()

    

    </script>
</body>
</html>